<template>
	<div class="full_com list-box">
		<div class="item-box czjz_com" v-for="(item,key,index) of dataList">
			<div class="title-box">{{key}}</div>
			<div class="xiantiao"></div>
			<div class="value-box">{{item}}</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				dataList: {
					'今日发布': 2,
					'已发布公告': 59,
					'阅读量': 1525,
					'互动量': 350,
				}
			}
		}
	}
</script>

<style scoped>
	.list-box {
		display: flex;
		justify-content: space-around;
		padding: 0 5%;
	}

	.item-box {
		width: 15%;
		height: 100%;
		color: #fff;
		text-align: center;
	}

	.title-box {
		font-size: 16px;
	}

	.xiantiao {
		background: linear-gradient(to right, rgba(82, 215, 251, 0), rgba(82, 215, 251, 0.6), rgba(82, 215, 251, 0));
		height: 2px;
		width: 100%;
		margin: 5px 0;
	}

	.value-box {
		font-size: 30px;
	}
</style>
